/*整体*/

@font-face {
    font-family: 'SIMHEI';
    src: url("../font/SIMHEI.TTF");
}


@font-face {
    font-family: 'STXINWEI';
    src: url("../font/STXINWEI.TTF");
}

::-webkit-scrollbar {
    display: none; /* Chrome Safari */
}

body, html {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
}

.background {

    background-image: url('../img/7 拷贝.png');
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: top center;
    width: 100%;
    height: calc(5023px * 0.77);; /* 假设背景图的宽 高比例为16:9 calc(1528px * (5023 / 1920))*/
}

.content {
    color: white;
    text-align: center;
    padding: 20px;
    background-color: rgba(0, 0, 0, 0.5);
    margin: 20px auto;
    width: 80%;
}

.bg-1 {
    position: absolute;
    left: calc(76px * 0.77);
    top: calc(989px * 0.77);
    width: calc(822px * 0.77);
    height: calc(604px * 0.77);
}

.bg-2 {
    position: absolute;
    right: 0;
    top: calc(3204px * 0.77);
    width: calc(387px * 0.77);
    height: calc(631px * 0.77);
}

.bg-3 {
    position: absolute;
    left: 0;
    top: calc(5023px * 0.77 - 1223px * 0.77);
    width: calc(952px * 0.77);
    height: calc(1223px * 0.77);
}

/*导航*/
.my-nav {
    background-color: rgba(195, 178, 140, 0.4);
    height: calc(73px * 0.77);
    position: relative;
}

.my-nav-left {
    position: relative;
    display: flex;
    align-items: flex-end;
}

.my-nav-img {
    margin-left: calc(128px * 0.77);
    width: calc(65px * 0.77);
    height: calc(65px * 0.77);
}

.my-nav-txt {
    height: 100%;
    margin-left: calc(8px * 0.77);
}

.my-nav-tab {
    position: absolute;
    left: calc(50% - 290px * 0.77);
    top: 0;
}

.my-nav-t1 {
    font-size: calc(14px * 0.77);
    color: white;
    font-family: 'SIMHEI' !important;
}

.my-nav-t2 {
    font-size: calc(12px * 0.77);
    color: white;
    font-family: 'SIMHEI' !important;
}

.my-nav-ul {
    width: calc(580px * 0.77);
    display: flex;
    flex-wrap: wrap;
    display: -webkit-flex; /* Safari */
}

.my-nav-ul > li {
    /*border: 1px solid black;*/
    flex: 1;
    text-align: center;
    padding-right: calc(29px * 0.77);
    padding-left: calc(29px * 0.77);
    height: calc(83px * 0.77);
}

.nav-link {
    font-size: calc(32px * 0.77);
    color: white !important;
    font-family: 'SIMHEI' !important;
}

.active > .nav-link {
    background-color: #C3B28C;
    height: calc(83px * 0.77);
    border-radius: 0 0 15px 15px;
}

.nav-item:hover .nav-link {
    background-color: #C3B28C;
    height: calc(83px * 0.77);
    border-radius: 0 0 15px 15px;
    transition: background-color 0.5s ease;
}

/*顶部图片*/
.top-content {
    width: 100%;
    text-align: center;
    padding-top: calc(83px * 0.77);
    position: relative;
}

.top-content .bg {
    /*width: 1695px;*/
    /*height: 835px;*/
    width: 88%;
    height: 88%;
}

.top-content .fa {
    position: absolute;
    margin-left: calc(78px * 0.77);
    margin-top: calc(32px * 0.77);
    width: calc(734px * 0.77);
    height: calc(391px * 0.77);
}

.top-content .line {
    position: absolute;
    height: calc(100px * 0.77);
    margin-left: calc(473px * 0.77);
    margin-top: calc(89px * 0.77);
    border-right: solid #ffffff 3px;
}

.top-content .Schools {
    position: absolute;
    margin-left: calc(488px * 0.77);
    margin-top: calc(89px * 0.77);
    width: calc(328px * 0.77);
    height: calc(96px * 0.77);
}

/*banner-content*/
.main-content {
    margin-top: 97px;
    position: relative;
    width: 62.6%;
    margin-left: auto;
    margin-right: auto;
}

#prevBtn {
    position: absolute;
    left: calc(-120px * 0.77);
    top: calc(435px * 0.77);

}

#nextBtn {
    position: absolute;
    top: calc(435px * 0.77);
    right: -100px;
}

/*主要派别*/
.main-schools-content {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.faction {
    padding: 28px 0 48px 0;
}


.main-schools-t1 {
    font-family: 'SIMHEI';
    font-size: calc(38px * 0.77);
}

.main-schools-t2 {
    font-family: 'SIMHEI';
    margin-left: 12px;
    font-size: calc(14px * 0.77);
    letter-spacing: 12px;
}


.my-swiper-container {
    background: rgba(248, 239, 220, 0.75);
    border-radius: calc(76px * 0.77);
    /*width: 850px;*/
    position: relative;
}


.swiper-slide {
    /*width: calc(385px * 0.77) !important;*/
    text-align: center;

}

.swiper-slide img {
    width: calc(385px * 0.77);
    height: calc(678px * 0.77);

    border-radius: calc(32px * 0.77);
}

.swiper-bottom {
    position: absolute;
    /*left: 11px;*/
    left: calc((100% - 385px * 0.77) / 2); /* 这里使用 calc 函数来计算 */
    right: calc((100% - 385px * 0.77) / 2); /* 这里使用 calc 函数来计算 */
    bottom: 0;
    width: calc(386px * 0.77);
    height: calc(79px * 0.77);
    background: #EFE3C8;

    text-align: center;
    border-radius: 0 0 calc(32px * 0.77) calc(32px * 0.77);
    display: flex;
    align-items: center;
    justify-content: center;
}

.school-name {
    font-family: 'STXINWEI';
    font-size: calc(34px * 0.77);
    color: black;
}

/*
详情
*/
.details {
    margin-top: calc(137px * 0.77);
    margin-bottom: calc(23px * 0.77);
}

.main-schools-t3 {
    font-size: calc(14px * 0.77);
    font-family: 'SIMHEI';
    margin-left: 5px;
    letter-spacing: 2px;
}


.swiper-des {
    position: absolute;
    top: 0;
    bottom: 0;
    width: calc(266px * 0.77);
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

.des-txt {
    font-family: 'STXINWEI';
    font-size: calc(34px * 0.77);
    color: #ffffff;
}

.swiper-slide-mini {
    /*width: calc(385px * 0.77) !important;*/
    text-align: start;
}

.swiper-slide-mini img {
    width: calc(266px * 0.77);
    height: calc(230px * 0.77);
    position: relative;
    border-radius: 0;
}


/*
按钮*/
#prevBtn-mini {
    position: absolute;
    left: calc(-80px * 0.77);
    top: calc(1185px * 0.77);
}

#nextBtn-mini {
    position: absolute;
    right: -60px;
    top: calc(1185px * 0.77);
}

.north {
    margin-top: calc(59px * 0.77);

}

.north-title {
    font-family: 华文中宋;
    font-size: calc(38px * 0.77);
    font-weight: normal;
    /*normal | bold | bolder | lighter*/
    margin-bottom: 10px;
}

.north-content {
    font-family: 'SIMHEI';
    font-size: calc(20px * 0.77);
    line-height: calc(28px * 0.77);
    text-align: center;
    height: 130px;
    padding: 0 calc(60px * 0.77) calc(56px * 0.77) calc(60px * 0.77);
}

/*了解画家
*/
.main-schools-pinter {
    font-size: calc(14px * 0.77);
    font-family: 'SIMHEI';
    margin-left: 15px;
    letter-spacing: 15px;
    font-weight: bold;

}

.container-pinter {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(2, 1fr);
    gap: 10px;
    width: 100%;
    /*max-width: 600px;*/
    margin: 0 auto;
    height: calc(1674px * 0.77);
}

.item-pinter {
    background: linear-gradient(to bottom, #C7C1A8, #C7C1A8, rgba(199, 193, 168, 0));
    border-radius: 150px 150px 0 0;
    width: calc(337px * 0.77);
    color: white;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-size: 24px;
    /* height: 100px; */
    flex-direction: column;
}

.item-pinter img {
    height: calc(337px * 0.77);
    padding: calc(6px * 0.77);
    background-image: url('../img/17.png');
    background-size: calc(337px * 0.77) calc(337px * 0.77);
}

.pinter-des {
    display: flex;
}

.text-line {
    word-wrap: break-word; /*英文的时候需要加上这句，自动换行*/
    /*自测了这句话没啥用*/
    writing-mode: vertical-rl; /*从左向右 从右向左是 writing-mode: vertical-rl;*/
    writing-mode: tb-rl; /*IE浏览器的从左向右 从右向左是 writing-mode: tb-rl；*/
    text-align: center;
    padding: 0px;
    display: flex;
    -webkit-display: flex;
    flex-direction: column;
    /* align-content: center; */
    /* vertical-align: middle; */
    justify-content: center;
    color: black;
}

.pinter-content-txt {
    height: calc(402px * 0.77);;
    font-family: 'SIMHEI';
    font-size: calc(22px * 0.77);
}

.pinter-title {
    display: flex;
    padding-right: calc(30px * 0.77);
    flex-direction: column;
    align-items: stretch;

}

.p-t-1 {
    font-family: 华文新魏;
    font-size: calc(41px * 0.77);;
}

.p-t-2 {
    font-family: 华文新魏;
    font-size: calc(22px * 0.77);;
}

/*
底部
*/

.content-bottom {
    position: relative;
    color: white;
    text-align: center;
    background-color: #302A29;
    width: 100%;
    height: calc(268px * 0.77);
    padding-top: calc(100px * 0.77);
}

.content-bottom .logo {
    width: calc(90px * 0.77);
    height: calc(90px * 0.77);
}

.content-bottom .sm {
    width: calc(223px * 0.77);
    height: calc(48px * 0.77);
}

.content-bottom .sm-en {
    width: calc(214px * 0.77);
    height: calc(18px * 0.77);
}

.content-bottom-div {
    display: flex;
    align-items: center;
    justify-content: center;
}

.content-bottom-div1 {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}


.content-bottom p {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    font-size: calc(19px * 0.77);
}